<template>
  <div aria-label="A complete example of page header">
    <el-page-header @back="onBack">
      <template #breadcrumb>
        <el-breadcrumb separator="/">
          <el-breadcrumb-item :to="{ path: './page-header.html' }">
            homepage
          </el-breadcrumb-item>
          <el-breadcrumb-item
            ><a href="./page-header.html">route 1</a></el-breadcrumb-item
          >
          <el-breadcrumb-item>route 2</el-breadcrumb-item>
        </el-breadcrumb>
      </template>
      <template #content>
        <div class="flex items-center">
          <el-avatar
            class="mr-3"
            :size="32"
            src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"
          />
          <span class="text-large font-600 mr-3"> {{doc.name}} </span>
          <span
            class="text-sm mr-2"
            style="color: var(--el-text-color-regular)"
          >
            【{{doc.deptName}}】
          </span>
          <el-tag>{{doc.job}}</el-tag>
        </div>
      </template>
      <template #extra>
        <div class="flex items-center">
          <el-button>Print</el-button>
          <el-button type="primary" class="ml-2">Edit</el-button>
        </div>
      </template>

      <el-descriptions :column="3" size="small" class="mt-4">
        <el-descriptions-item label="科室电话">{{doc.map.dept.phone}}</el-descriptions-item>
        <el-descriptions-item label="科室地址">{{doc.map.dept.loc}}</el-descriptions-item>
        <el-descriptions-item label="科室名称">
          <el-tag size="small">{{doc.map.dept.name}}</el-tag>
        </el-descriptions-item>
      </el-descriptions>
      <p class="mt-4 text-sm">
        Element Plus team uses <b>weekly</b> release strategy under normal
        circumstance, but critical bug fixes would require hotfix so the actual
        release number <b>could be</b> more than 1 per week.
      </p>
    </el-page-header>
  </div>
</template>

<script>
import { ElNotification as notify } from 'element-plus'

export default{
    inject:["global"],
    props:{
      empno:String
    },
    data(){
        return{
           doc:null
        }
    },
    created:function(){
        
       const axios=this.global.axios;
       axios.get("http://192.168.2.5:9000/hp/doc/findbyempno?empno="+this.empno)
       .then(resp=>{
           this.doc=resp.data.obj;
           console.log(this.doc)
       })
    },
    methods:{
        onBack:function() {
          notify('Back')
        }
    }
}

</script>


